*{
    padding: 0;
    margin: 0;
    text-decoration: none;
}/*
body{
    background: url(../img/背景2.jpg)no-repeat;
    background-size: cover;
    width: 100vw;
    height: 100vh;
}*/
body{
    background: #000;
    width: 100%;
    height: 100vh;
    position: relative;
    overflow: hidden;
}
body::after{
    content: "";
    /* background: url(../img/前端.jpg)no-repeat; */
    background: linear-gradient(90deg,rgb(120, 207, 241),rgb(145, 152, 248));
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.9;
    animation: anim 4s linear infinite;
}
@keyframes anim{
    50%{ 
        transform: scale(1.3);
    }
    100%{
        transform: scale(1);
    }
}
.container{
    width: 900px;
    height: 500px;
    border-radius: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: rgba(255, 255, 255, 0.8); 
    /* box-shadow: 0 0 40px  rgb(255, 255, 255); */
    z-index: 1;
    position: relative;
}/*
.container::before{
    content:url(../img/太阳.png);
    top: -130px;
    left: 585px;
    z-index: -99;
    position: absolute;
    animation: mysecond 80s;
}*/
/* .container::after{
    content:url(../img/船1.png);
    top: 510px;
    left: 880px;
    z-index: 0;
    position: absolute;
} */
@keyframes myfirst
{
from {left: 1200px;}
to {left:-400px;}
}
@keyframes mysecond
{
    from{top:-130px;}
    to{top:-40px;}
}
.icon{
    width: 299px;
    height: 100%;
    border-right: 1px solid #eee;
    float: left;
}
.icon img{
    display: block;
    width: 200px;
    height: 200px;
    margin: 50px auto;
}
menu{
    width: 50px;
    height: 500px;
    float: left;
    border-right: 1px solid #eee;
    font-weight: 200;
}
menu .to{
    padding: 50px 5px;
    height: 150px;
    font-size: 20px;
    line-height: 24px; 
    text-align: center;
    background-color: rgb(130, 172, 235);
}
menu .to,.bo{
    cursor:pointer;
}
menu .bo{
    height: 200px;
    padding: 25px 5px;
    font-size: 20px;
    line-height: 24px; 
    text-align: center;
}
.sanjiao{
    width: 0px;
    height: 0px;
    border-top: 10px solid transparent;
    border-left: 20px solid rgb(130, 172, 235);
    border-bottom: 10px solid transparent;
    position: absolute;
    left: 350px;
    top: 0;
}
.con-main{
    width: 530px;
    height: 100%;
    float: right;
}
.logon,.register{
    margin: 150px 0;
}
input{
    display: block;
    width: 400px;
    height: 40px;
    font-size: 16px;
    outline-style: none;
    border: 1px solid rgb(130, 172, 235);
    border-color:linear-gradient(90deg,rgb(120, 207, 241),rgb(145, 152, 248)) ;
    margin: 10px auto;
    border-radius: 10px;
    padding: 0 10px;
}
input::-ms-reveal{
    display:none;
}
input::-ms-clear{
    display:none;
}
.password{
    position: relative;
}
.con-main img{
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    top: 15px;
    left: 450px; 
}
button{
    display: block;
    outline: none;
    border: none;
    border-radius: 10px;
    /* background-color: #fff; */
    margin: 10px auto;
}
button a{
    display: block;
    border-radius: 10px;
    /* color:rgb(130, 172, 235); */
    background: linear-gradient(90deg,rgb(120, 207, 241),rgb(145, 152, 248));
    color: #fff;
    font-size: 20px;
    width: 420px;
    padding: 10px 0;
    overflow: hidden;
    transition: background-color 0.5s,
                color 2s;
    position: relative;
    overflow: hidden;
}
button a::after{
    content: "";
    width: 400px;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    position: absolute;
    top: 0;
    left: -400px;
    transition: all 0s;
}
button a:hover::after{
    transition:all 0.5s;
    left: 450px;
}

@keyframes move{
    from{
        width: 0;
        height: 0;
    }
    to{
        width: 50px;
        height: 50px;
    }
}

.forget{
    float: right;
    margin: 0 40px;
    width: 70px;
}
.forget a{
    display: block;
    color: rgb(97, 195, 240);
    font-size: 14px;
}
.forget a:hover{
    color: rgb(94, 147, 226);
}


